<template>
  <div>
    <table>
      <tr>
        <th>id</th>
        <th>商品名</th>
        <th>单价</th>
        <th>操作</th>
      </tr>
      <tr>
        <td>1</td>
        <td>小明牌肥皂</td>
        <td>500.00元</td>
        <td>
          <button>删除</button>
        </td>
      </tr>
      <tr>
        <td colspan="5">总价为：500.00元</td>
      </tr>
    </table>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
table {
  border: 1px solid #ddd;
  border-collapse: collapse;
}

td,
th {
  border: 1px solid #ddd;
  width: 130px;
  height: 30px;
  text-align: left;
  padding: 10px;
}
</style>